<template>
	<view class="container">
			<view class="user-box" v-if="isUser">
			<view class="user-left">
				<u-image src="https://cdn.uviewui.com/uview/album/1.jpg"  width="30vw" height="20vh"></u-image>
			</view>
			<view class="user-right" @click="register">
				点击登录
			</view>
			</view>
			<view class="user-box" v-else>
			<view class="user-left">
				<u-image :src="userlist.avatar"  width="30vw" height="20vh" @click="updateInfo"></u-image>
			</view>
			<view class="user-right" @click="deluser">
				{{userlist.username}}
			</view>
			</view>
		<view class="user-features">
			<UserList/>
		</view>
		</view>
</template>

<script>
	export default {
		data() {
			return {
				userlist:{},
				isUser:true
			}
		},
		created() {
			
		},
		onShow() {
			if(this.$store.state.Key!=''){
				this.isUser=false
				// this.userlist=this.$store.state.userInfo
				
				this.$get(this.API.info).then((res)=>{
					this.userlist=res.data.data
					this.userlist.avatar = this.userlist.avatar+'?temp='+Math.random()
					console.log(this.userlist)
				})
			}
	
		},
		onHide() {
			if(this.$store.state.Key!=''){
				this.isUser=false
				// this.userlist=this.$store.state.userInfo
				this.$get(this.API.info).then((res)=>{
					this.userlist=res.data.data
				})
			}
		},
		methods: {
			register(){
				uni.navigateTo({
					url: "../register/register",
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			deluser(){
				this.$post(this.API.logout,{token:this.$store.state.Key}).then((res)=>{
					this.isUser=true
				})
				
			},
			updateInfo(){//跳转到头像更改
				uni.navigateTo({
					url:'../updateInfo/updateInfo'
				})
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	
.container{
	.user-box{
		height: 20vh;
	.user-left{
		float: left;
		width: 30vw;
		overflow: hidden;
	}
	.user-right{
		line-height: 20vh;
		margin-left: 50rpx;
		float: left;
		letter-spacing: 30rpx;
		font-size: 35rpx;
		font-weight: 900;
	}
	}
}
</style>

